<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="keywords" content="iflowCms,iflowFramework">
    <meta name="description" content="iflowCMS 一款快速搭建 企业官网的 CMS建站系统，支持自定义表单模型，表单模型关联，自定义权限，支持微信支付，Palpay支付，文件资源管理等功能">
    <link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
    <!-- 新 Bootstrap4 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
    <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
    <!-- bootstrap.bundle.min.js 用于弹窗、提示、下拉菜单，包含了 popper.min.js -->
    <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
    <!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
    <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>

    <!-- 引入 layui.css -->
    <link rel="stylesheet" href="//unpkg.com/layui@2.6.4/dist/css/layui.css">
    <!-- 引入 layui.js -->
    <script src="//unpkg.com/layui@2.6.4/dist/layui.js"></script>

    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->

    <!-- APlayer -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer@1.10.1/dist/APlayer.min.css">
    <script src="https://cdn.jsdelivr.net/npm/aplayer@1.10.1/dist/APlayer.min.js"></script>

    <!--  Axios 请求库  -->
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>
    <script src="/static/cms/js/axios.js"></script>

    <style>
        .background {
            background-image: url("https://api.mtyqx.cn/tapi/random.php");
            background-repeat: no-repeat;
            background-size: cover;
            width: 100%;
            height: 100vh;
            position: fixed;
        }
        .header-nav-right {
            position: absolute;
            top: 0;
            right: 20px;
        }
        .layui-nav {
            z-index: 2;
            background-color: transparent !important;
        }
        .layui-this:after {
            background-color: transparent !important;
        }
        .layui-nav-bar {
            display: none;
        }
        a {
            text-decoration: none;
        }
        .mark {
            position: fixed;
            height: 100vh;
            width: 100%;
            z-index: 1;
            opacity: 0.5;
            background-color: #252525;
        }
        .hitokoto {
            position: relative;
            color: white;
            z-index: 1;
            margin: 35vh auto;
            font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif;
            width: 55%;
        }
        .bracket {
            font-size: 30px;
            position: absolute;
        }
        .left {
            top: 0;
            left: 0;
        }
        .right {
            right: 0;
            bottom: 0;
        }
        .word {
            font-size: 2.3rem;
            text-align: center;
            line-height: 50px;
            word-break: normal;
            margin: 0;
            padding: 15px 50px;
        }
        .author {
            font-size: 20px;
            color: rgba(255, 255, 255, 0.8);
            float: right;
            margin-top: 40px;
        }

        .footer {
            position: fixed;
            text-align: center;
            bottom: 40px;
            width: 100%;
            z-index: 9;
        }

        .footer a {
            color: #ffffffa1 !important;
        }

        .footer .govimg {
            display: inline-block;
            margin-top: -4px;
            margin-right: 6px;
            width: 14px;
            height: 1pc;
            background: url(https://blog.mzshe.cn/wp-content/themes/kratos-pjax-0.2.9/images/icon-police.png) 0 0 no-repeat;
            vertical-align: middle;
        }
        @media (max-width: 980px) {
            .header-nav-right {
                left: 86px;
            }
            .hitokoto {
                margin: 20vh auto;
                width: 80%;
            }
            .word {
                font-size: 24px;
            }
            .layui-nav .layui-nav-item a {
                font-size: 15px;
                padding: 0 12px;
            }
        }
    </style>
</head>
<body>
    <div class="background"></div>
    <div class="mark"></div>
    <ul class="layui-nav" lay-filter="">
        <li class="layui-nav-item">
            <a class="nav-link" href="/" target="_blank" style="color: #ffffff">
                <img src="/favicon.ico" alt="" style="width: 38px; border-radius: 12px; opacity: .8;">
            </a>
        </li>
        <div class="header-nav-right">
            <li class="layui-nav-item"><a href="/cms/home/cms-pages" target="_blank">IflowCms首页</a></li>
            <li class="layui-nav-item"><a href="https://framework.mzshe.cn" target="_blank">IflowFrameWork</a></li>
        </div>
    </ul>
    <!--  页面内容 一言  -->
    <div class="hitokoto">
        <div class="bracket left">『</div>
        <div class="word" id="hitokoto_text">你现在的气质里，藏着你走过的路，读过的书和爱过的人。</div>
        <div class="bracket right">』</div>
        <div class="author" id="hitokoto_author">—— 迈克尔·柯蒂茲「卡萨布兰卡」</div>
    </div>
    <div class="footer">
        <p><a href="http://www.miitbeian.gov.cn/" rel="external nofollow" target="_blank">湘ICP备17021288号</a></p>
        <a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=43052502000032" rel="external nofollow" target="_blank">
            <i class="govimg"></i>湘公网安备 43052502000032号
        </a>
    </div>
    <div id="aplayer"></div>
</body>
<script src="/static/cms/js/aplay.js"></script>
<script>
    layui.use('element', function(){
        var element = layui.element;
    });

    function getHitokoto() {
        fetch('https://v1.hitokoto.cn/?encode=json', {
            method: 'get'
        }).then(res => {
            return res.json()
        }).then(res => {
            $('#hitokoto_text')[0].innerText = res.hitokoto
            $('#hitokoto_author')[0].innerText = `—— ${res.from}`
        })
    }
    getHitokoto()
    setInterval(getHitokoto, 10000)
</script>
</html>